<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智慧社区后台</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/AdminLTE.min.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/plugins/bootstrap-table/css/bootstrap-table.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap-switch/css/bootstrap-switch.min.css" />
</head>
<style>
</style>
<body style="padding-bottom: 90px; background-color: #FFF;">
	<!-- 添加电话 -->
	<div id="applyModal" >
		<div class="modal-body">
			<%-- <div class="form-group">
				<label class="control-label">小区：</label> <input type="text" class="form-control" id="communityName" value="${sessionScope.communityName}" readonly="readonly">
			</div> --%>
			<div class="form-group">
				<label class="control-label">期数：<span style="color:#F00">*</span></label> <!-- <input type="text" class="form-control" id="numberPeriods"> -->
				<select id="numberPeriods" class="form-control" onchange="numberPeriodsChange()">
					<option value="">请选择...</option>
				</select>
			</div>
			<div class="form-group">
				<label class="control-label">楼栋：<span style="color:#F00">*</span></label> <!-- <input type="text" class="form-control" id="building"> -->
				<select id="building" class="form-control" onchange="buildingChange()">
				<option value="">请选择...</option>
				</select>
			</div>
			<div class="form-group">
				<label class="control-label">单元：<span style="color:#F00">*</span></label> 
		       <!--  <input type="text" class="form-control" id="unitNum"> -->
		        <select id="unit" class="form-control">
					<option value="">请选择...</option>
				</select>
			</div>
			<div class="form-group">
				<label class="control-label">状态：<span style="color:#F00">*</span></label> <select id="state" class="form-control">
					<option value="">请选择...</option>
					<option value="0">出租</option>
					<option value="1">自住</option>
					<option value="2">空置</option>
				</select>
			</div>
			<div class="form-group">
				<label class="control-label">建成时间：<span style="color:#F00">*</span></label> <input type="text" class="form-control" id="builtTime">
			</div>
			<div class="form-group">
				<label class="control-label">缴物业费时间：<span style="color:#F00">(初次)</span></label> <input type="text" class="form-control" id="s1">
			</div>
			<div id="danyuan" class="form-group">
					<div class="modal-header">
						<h4 class="modal-title" style="text-align: center;">房间信息</h4>
					</div>
					<div class="form-group" style="height: 8px;width: 100%;">
						<div class="col-sm-3">
						<strong style="text-align: center;display: block;">房屋编号 <span style="color:#F00">*</span> </strong>
						</div>
						<div class="col-sm-3">
						<strong style="text-align: center;display: block;">房型<span style="color:#F00">*</span></strong>
						</div>
						<div class="col-sm-3">
						<strong style="text-align: center;display: block;">面积(平方米)<span style="color:#F00">*</span></strong>
						</div>
						<div class="col-sm-3">
						<strong style="text-align: center;display: block;">价格(元)<span style="color:#F00">*</span></strong>
						</div>
					</div>
					<div id="field1">
						<div class="row" style="width: 100%; margin-left: 10px;"><br>
							<div class="col-sm-3"><input  type="text" class="form-control" id="doorCard" placeholder="示例  '101','1001'" onBlur="checkingDoorCard()"></div>
							<div class="col-sm-3"><input  type="text" class="form-control"id="houseType"></div>
							<div class="col-sm-3"><input  type="text" class="form-control" id="area"></div>
							<div class="col-sm-3"><input  type="text" class="form-control" id="price" onchange="this.value=toThousands(this.value)"></div>
						</div>
					</div>
			</div>
		</div>
	</div>

</body>
<script src="${pageContext.request.contextPath}/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-switch/js/bootstrap-switch.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-table/js/bootstrap-table.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-table/js/bootstrap-table-zh-CN.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-table/js/bootstrap-table-export.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-table/js/tableExport.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-table/js/bootstrap-table-toolbar.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-table/js/bootstrap-table-filter-control.js"></script>
<script src="${pageContext.request.contextPath}/js/ajaxfileupload.js"></script>
<!-- layer -->
<script src="${pageContext.request.contextPath}/plugins/layer/2.4/layer.js"></script>
<script src="${pageContext.request.contextPath}/plugins/laydate/laydate.js"></script>
<script src="${pageContext.request.contextPath}/js/date.js"></script>
<script>
	var id="${map['id']}";
	var index = parent.layer.getFrameIndex(window.name);
	laydate.render({ 
		  elem: '#builtTime'
		  ,type: 'date' //默认，可不填
		});
	laydate.render({ 
		  elem: '#s1'
		  ,type: 'month' //默认，可不填
		});
	var checkDoorCard=false;
	
	$(function() {
		$.ajax({
			url : "${pageContext.request.contextPath}/selectHouseData",
			type : "post",
			dataType : "json",
			success : function(data) {
				var periods = data['numberPeriods'];
				var building=data['building'];
				var unit=data['unit'];
				var periodshtml = "<option value=''>请选择...</option>";
				var buildinghtml = "<option value=''>请选择...</option>";
				var unithtml = "<option value=''>请选择...</option>";
				for (var i = 0; i < periods.length; i++) {
					periodshtml += "<option value='"+periods[i].numberPeriods+"'>" + periods[i].numberPeriods + "</option>";
				}
				for (var i = 0; i < building.length; i++) {
					buildinghtml += "<option value='"+building[i].building+"'>" + building[i].building + "</option>";
				}
				for (var i = 0; i < unit.length; i++) {
					unithtml += "<option value='"+unit[i].unit+"'>" + unit[i].unit + "</option>";
				}
				$("#numberPeriods").html(periodshtml);
				$("#building").html(buildinghtml);
				$("#unit").html(unithtml);
				if(id!=''){
					ajaxPost();
				}
			},
			error : function() {
				layer.msg('系统繁忙，请稍后再试!', {
					icon : 2,
					time : 800
				});
			}
		});
		//debugger;
	});
	
	
	function ajaxPost(){
		$.ajax({
			url : "${pageContext.request.contextPath}/selectHouseById",
			type : "post",
			data : {
				id : id
			},
			dataType : "json",
			success : function(data) {
				var house = data['house'];
				$("#numberPeriods").val(house.numberPeriods);
				$("#building").val(house.building);
				$("#unit").val(house.unit);
				$("#builtTime").val(house.builtTimeStr);
				$("#doorCard").val(house.doorCard);
				$("#houseType").val(house.houseType);
				$("#area").val(house.area);
				$("#price").val(house.price);
				$("#state").val(house.state);
				$("#s1").val(house.s1);
			}
		});
	}
	
	 //选中期数加载楼栋
	 function numberPeriodsChange(){
		 $.ajax({
				url : "${pageContext.request.contextPath}/selectBuilding",
				type : "post",
				data : {
					numberPeriods : $("#numberPeriods").val()
				},
				dataType : "json",
				success : function(data) {
					var building = data['building'];
					var html = "<option value=''>请选择...</option>";
					for (var i = 0; i < building.length; i++) {
						html += "<option value='"+building[i].building+"'>" + building[i].building + "</option>";
					}
					$("#building").html(html);
				}
			});
	 }
	 //加载单元
	 function buildingChange(){
		 var numberPeriods=$("#numberPeriods").val();
	     $.ajax({
				url : "${pageContext.request.contextPath}/selectUnit",
				type : "post",
				data : {
					building : $("#building").val(),
					numberPeriods : numberPeriods
				},
				dataType : "json",
				success : function(data) {
					var unit = data['unit'];
					var html = "<option value=''>请选择...</option>";
					for (var i = 0; i < unit.length; i++) {
						html += "<option value='"+unit[i].unit+"'>" + unit[i].unit + "</option>";
					}
					$("#unit").html(html);
				}
			});
	 }
	/*  $("#doorCard").bind("input propertychange",function(event){
        console.log($("#doorCard").val());
		}); */
	function insert() {
		var numberPeriods=$("#numberPeriods").val();
		var building=$("#building").val();
		var unit=$("#unit").val();
		var builtTimeStr=$("#builtTime").val();
		var doorCard=$("#doorCard").val();
		var houseType=$("#houseType").val();
		var area=$("#area").val();
		var price=$("#price").val();
		var state=$("#state").val();
		var s1=$("#s1").val();
		var url='';
		if (numberPeriods == '' || building == '' || unit == ''|| builtTimeStr == '' || doorCard == '' || houseType == ''||area == ''||price=='' ||state=='') {
			layer.alert("所有数据必填，请填写!");
			return;
		}
		//console.log(checkDoorCard);
		if(checkDoorCard){
			layer.alert("房屋重复!");
			return;
		}
		if(id==''){
			url="${pageContext.request.contextPath}/insertHousePropertyOne";
			
		}else{
			url="${pageContext.request.contextPath}/updateHouseProperty";
		}
		
		
		$.ajax({
			url : url,
			type : "post",
			data : {
				id:id,
				numberPeriods : numberPeriods,
				building : building,
				unit : unit,
				builtTimeStr :builtTimeStr,
				doorCard : doorCard,
				houseType : houseType,
				area : area,
				price :price,
				state:state,
				s1:s1
			},
			dataType : "json",
			success : function(data) {
				var result = data['result'];
				if (result === 1) {
					layer.msg('操作成功!', {
						icon : 1,
						time : 800
					});
					setTimeout(function() {
						parent.querry();
						parent.layer.close(index);
					}, 1000); 
				} else {
					layer.msg('操作失败!', {
						icon : 2,
						time : 800
					});
					layer.close(loading);
				}
			},
			error : function() {
				layer.msg('系统繁忙，请稍后再试!', {
					icon : 2,
					time : 800
				});
			}
		});
	}
	
	 function checkingDoorCard(){//房屋是否重复添加
		 checkDoorCard=false;
		 if(id==''){
			 $.ajax({
					url : "${pageContext.request.contextPath}/checkingDoorCard",
					type : "post",
					data : {
						numberPeriods : $("#numberPeriods").val(),
						building : $("#building").val(),
						unit:$("#unitNum").val(),
						doorCard:$("#doorCard").val()
					},
					dataType : "json",
					success : function(data) {
						var result = data['result'];
						if (result === 0) {
							checkDoorCard=true;
						}
					},
					error : function() {
						layer.msg('系统繁忙，请稍后再试!', {
							icon : 2,
							time : 800
						});
					}
				});
			}
	}
	
	 function toThousands(number){
	     var decimals=2;//要格式化的数字
	     var dec_point='.';//保留几位小数
	     var thousands_sep=',';//千分位符号
		 number = (number + '').replace(/[^0-9+-Ee.]/g, '');
		 var n = !isFinite(+number) ? 0 : +number,
		 prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
		 sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
		 dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
		 s = '',
         toFixedFix = function (n, prec) {
              var k = Math.pow(10, prec);
              return '' + Math.floor(n * k) / k;
         };
         s = (prec ? toFixedFix(n, prec) : '' + Math.floor(n)).split('.');
         var re = /(-?\d+)(\d{3})/;
         while (re.test(s[0])) {
             s[0] = s[0].replace(re, "$1" + sep + "$2");
         }
	
	    if ((s[1] || '').length < prec) {
	         s[1] = s[1] || '';
		     s[1] += new Array(prec - s[1].length + 1).join('0');
		}
		 return s.join(dec);
    }
</script>
</html>
